iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 18
0
自我挑戰組

溫故知新 JavaScript系列 第 18

Day18- 關於迴圈

  • 分享至 

  • xImage
  •  

https://ithelp.ithome.com.tw/upload/images/20201001/20129439x9ciwp3TIZ.jpg
為什麼需要迴圈呢?舉個例在前面陣列與物件那單元我們把每一座農場的資訊(農夫是誰、小雞數量等等)包裝成物件放在陣列裡面,如果今天我們要知道每一座農場的農夫姓名我們會採取的作法是這樣:

陣列物件

 var farm1 =[
      {
        farmer: '老王',
        dogs: ['小黑','汪汪','雪寶','高飛'],
        chick: 10
        
      },
      {
        farmer: '小陳',
        dogs: ['老皮','小黃','恰恰','賤狗'],
        chick: 30,
      }
];

取物件內值得方法

console.log(farm1[0].farmer); //老王
console.log(farm1[1].farmer); //小陳

如果今天這個陣列內有100個農場,那這樣取值的方式也太沒效率程式肯定變得非常冗長,因此如果透過迴圈就能簡化取值的步驟效率也比較高那迴圈的寫法是什麼呢?以上面那個例子我們要知道每一座農場的農夫主人是誰可以用迴圈這樣寫:

for(var i=0;i<farm1.length;i++){
  console.log('第'+(i+1))+'個農場主人是'+farm1[i].farmer);
}
//第一個農場主人是老王
//第一個農場主人是小陳

解析語法

這邊再進一步說明在 for 迴圈內是怎麼運作的,請先看下面這張圖:

一開始先寫 for 後面的括號就放要告訴這個迴圈依照什麼邏輯去跑,一開始的 var i=0 代表從 0 開始跑;如果i小於整個農場的數量farm1.length 就是農場的總數量的意思;後面的 i++就是去累加,並執行{} 內的程式,直到 i 的條件大於或等於農場的總數,程式就會停止。

以上就是最簡單的 for 迴圈的概念講的可能不是特別清楚,如果大家有更好的說明歡迎在留言區補充喔,明天會介紹更多 for 迴圈的寫法。


上一篇
Day17- 控制判斷 if、else if、switch
下一篇
Day19- 迴圈加上控制判斷
系列文
溫故知新 JavaScript30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言